﻿
@{
    ViewData["Title"] = "Index";
    Layout = null;
}

<link href="~/libs/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />


<style>
    body {
        font-family: Arial, sans-serif;
        padding: 20px;
        background-color: #f9f9f9;
    }

    th, td {
        border: 1px solid #ddd;
        padding: 10px;
        text-align: left;
    }

    th {
        background-color: #f4f4f4;
        font-weight: bold;
    }

    .toolbar {
        margin-bottom: 10px;
    }

        .toolbar input[type="text"] {
            margin-right: 10px;
        }

        .toolbar button {
            margin-right: 5px;
            background-color: #007bff;
            color: white;
            border: none;
            padding: 8px 12px;
            cursor: pointer;
            border-radius: 4px;
        }

            .toolbar button:hover {
                background-color: #0056b3;
            }

    .actions button {
        background-color: #dc3545;
        color: white;
        border: none;
        padding: 5px 10px;
        cursor: pointer;
        border-radius: 4px;
    }

        .actions button:hover {
            background-color: #c82333;
        }
</style>

<body>

    <h2>盘点差异</h2>
    <br />
    <div class="toolbar">
        <label>中文全称: <input type="text" id="productName"></label>
        <button id="searchButton">查询</button>
 


    </div>

    <table class="layui-hide" id="mainData" lay-filter="mainData" style="margin-top: 10px;margin-left: 20px">
    </table>



    <script src="~/libs/jquery/jquery.js"></script>
    <script src="~/libs/layui-v2.5.6/layui/layui.all.js"></script>

    <script>
        layui.use(['table', 'form', 'layer'], function () {
            var table = layui.table;
            var form = layui.form;
            var layer = layui.layer;

            // 渲染数据表格
            function showData() {
                table.render({
                    elem: '#mainData',
                    url: '/Category/GetCategory',
                    page: true,
                    limit: 10,
                    limits: [10, 20, 30],
                    cols: [[

                        { field: 'productCode', title: '分类编码', align: 'center' },
                        { field: 'productName', title: '分类名称', align: 'center' },
                        {
                            field: 'productlevel',
                            title: '分类级别',
                            templet: function (d) {
                                return d.productlevel ? '高级' : '初级';
                            },
                           
                            key: 'stockStatus' // 使用 key 来标识这一列
                        },
              
                    ]],
                    where: {
                        productName: $("#productName").val().toString(),
                    },
                    parseData: function (res) {
                        console.log(res);
                        return {
                            code: res.code,
                            count: res.data.result.pageCount,
                            data: res.data.result.queryable
                        };
                    },
                });
            }

            showData();

            // 监听工具条
            table.on('tool(mainData)', function (obj) {
                var data = obj.data; // 获取当前行数据
                if (obj.event === 'delete') {
                    layer.confirm('确定要删除吗？', {
                        btn: ['确定', '取消'] // 按钮
                    }, function () {
                        $.ajax({
                            url: '/Difference/DifferenceDelete',
                            type: 'post',
                            data: {
                                id: data.id
                            },
                            success: function (res) {
                                if (res.msg == '删除成功') {
                                    layer.msg(res.msg, { icon: 1, time: 1000 }, function () {
                                        showData(); // 刷新表格
                                    });
                                } else {
                                    layer.msg(res.msg, { icon: 2, time: 1000 });
                                }
                            }
                        });
                    }, function () {
                        layer.msg('已取消', { icon: 1, time: 1000 });
                    });
                }

            });




        });
    </script>

</body>

